<template>
  <div>
    <!-- 版本更新 -->
    <u-popup :show="popupShow" mode="center" :round="20">
      <view style="width: 630rpx;min-height: 700rpx;position: relative;">
        <u-image class="s-image" width="100%" height="480rpx" src="/static/index/bg-update.png"></u-image>
        <view class="bg-blue"></view>
        <view class="text-center u-p-t-20 text-black text-bold" style="font-size: 48rpx;">发现新版本</view>
        <view class="u-m-t-40 u-m-l-30" style="color: #7E7E7E;">
          <view class="">v{{appParams.versionName}}</view>
          <!-- <block v-for="(con,i) in content" :key="i">
    				<view class="u-m-t-30 dian">{{con}}</view>
    			</block> -->
          <view class="u-m-t-30" v-html="appParams.numberContent"></view>
        </view>

        <view class="u-m-r-30 u-m-l-30 u-m-t-60 u-m-b-30">
          <u-button v-if="appParams.btnShow" color="#FF2E3F" @click="downApk" height="20" type="primary" class="btns"
            text="马上升级">
          </u-button>
          <u-line-progress v-else :percentage="appParams.progress"></u-line-progress>
          <view v-if="appParams.isUpdate==1&&appParams.btnShow" @click="popupShow=false" class="u-m-t-30 text-center"
            style="color: #7E7E7E;">以后再说</view>
        </view>
      </view>
    </u-popup>

  </div>
</template>

<script>
  import config from '@/common/config.js';

  export default {
    data() {
      return {
        popupShow: false,
        appParams: {
          btnShow: true,
          progress: 0,
          versionName: '',
          versionNumber: '',
          numberContent: '',
          downloadUrl: '',
          appType: '', //app类型(1.用户 2商户 3.商管 4车城 5平台)
          systemType: '', //系统类型（1.苹果 2安卓）
          isUpdate: '1', //是否强制更新(1.否 2是)
        }
      }
    },
    methods: {
      //校验APP版本更新
      androidCheckUpdate(dataType, version) {
        let that = this
        uni.request({
          url: config.updateUrl + '/hundred/appManagement/newAppManagement',
          method: 'GET',
          data: {
            appType: 5, //app类型(1.用户 2商户 3.商管 4车城 5平台)
            systemType: 2, //系统类型（1.苹果 2安卓）
          },
          header: {
            "Content-type": "application/x-www-form-urlencoded"
          }
        }).then(res => {
          let data = JSON.parse(JSON.stringify(res[1].data));
          if (data) {
            let {
              versionName,
              versionNumber,
              downloadUrl,
              numberContent,
              isUpdate
            } = data.result;

            that.appParams.downloadUrl = downloadUrl;
            that.appParams.versionName = versionName;
            that.appParams.numberContent = numberContent;
            this.appParams.isUpdate = isUpdate;

            let versionCode = parseFloat(version.split('.').join(''))
            let versionOut = parseFloat(versionNumber);
            if (versionCode < versionOut) {
              if (isUpdate == 2) {
                uni.hideTabBar({})
              }
              that.popupShow = true;
            } else {
              if (!that.$store.state.$token) {
                that.$utils.href('/pages/login/login');
              }
            }
          }

        })
      },
      //下载app
      downApk: function() {
        var that = this;
        var url = that.appParams.downloadUrl;
        const downloadTask = uni.downloadFile({
          url: url,
          success: (res) => {
            if (res.statusCode === 200) {
              var path = res.tempFilePath;
              plus.runtime.install(path, {}, function() {}, function(e) {
                plus.nativeUI.closeWaiting();
                plus.nativeUI.alert("安装apk文件失败[" + e.code + "]：" + e.message);
              });
            }
          }
        });
        that.appParams.btnShow = false;
        downloadTask.onProgressUpdate((res) => {
          that.appParams.progress = res.progress;
        });
      }
    }
  }
</script>

<style>
  .s-image {
    position: absolute;
    left: 0;
    right: 0;
    top: -130rpx;
    z-index: 999;
  }

  .bg-blue {
    position: relative;
    top: 0;
    background: linear-gradient(90deg, #FF2E3F 0%, #FF2E3F 47%, #FF2E3F 100%);
    height: 346rpx;
    width: 100%;
    border-top-left-radius: 20rpx;
    border-top-right-radius: 20rpx;
  }
</style>
